<ui:composition xmlns="http://www.w3.org/1999/xhtml"
	xmlns:ui="http://java.sun.com/jsf/facelets"
	xmlns:h="http://java.sun.com/jsf/html"
	xmlns:f="http://java.sun.com/jsf/core"
	xmlns:p="http://primefaces.org/ui" template="/pageUtils/template.xhtml">

	<ui:define name="body">
		<h:form prependId="false">
			<div align="left">
				<p:messages id="messages" showDetail="true" autoUpdate="true" />
				<h:panelGrid columns="9" id="painel">

					<h:outputText value="Nome :" />
					<p:inputText id="nome" value="#{eleitorController.eleitor.nome}"
						maxlength="60" title="informe o nome do eleitor" />
					<p:tooltip for="nome" showEvent="focus" hideEvent="blur" />

					<h:outputText value="Titulo :" />
					<p:inputText id="titulo"
						value="#{eleitorController.eleitor.titulo}" maxlength="10"
						title="informeo numero do titulo" />
					<p:tooltip for="rua" showEvent="focus" hideEvent="blur" />

					<h:outputText value="Rua :" />
					<p:inputText id="rua" value="#{eleitorController.eleitor.rua}"
						maxlength="30" title="informe a rua" />
					<p:tooltip for="rua" showEvent="focus" hideEvent="blur" />

					<h:outputText value="Numero :" />
					<p:inputText id="numero"
						value="#{eleitorController.eleitor.numero}" maxlength="6"
						title="informe o numero da rua" />
					<p:tooltip for="numero" showEvent="focus" hideEvent="blur" />

					<h:outputText value="Cep :" />
					<p:inputText id="cep" value="#{eleitorController.eleitor.cep}"
						maxlength="8" title="informe o numero do cep" />
					<p:tooltip for="cep" showEvent="focus" hideEvent="blur" />

					<h:outputText value="Complemento :" />
					<p:inputText id="complemento"
						value="#{eleitorController.eleitor.complemento}" maxlength="30"
						title="informe o complemento" />
					<p:tooltip for="complemento" showEvent="focus" hideEvent="blur" />

					<h:outputText value="
						Bairro :" />
					<p:inputText id="bairro"
						value="#{eleitorController.eleitor.bairro}" maxlength="30"
						title="informe o bairro" />
					<p:tooltip for="bairro" showEvent="focus" hideEvent="blur" />

					<h:outputText value="Celular :" />
					<p:inputMask id="celular"
						value="#{eleitorController.eleitor.celular}" maxlength="10"
						mask="(99) 9999-9999" title="informe o numero do celular" />
					<p:tooltip for="celular" showEvent="focus" hideEvent="blur" />

					<h:outputText value="Residencial :" />
					<p:inputMask id="residencial"
						value="#{eleitorController.eleitor.residencial}" maxlength="10"
						mask="(99) 9999-9999" title="informe o numero do fone residencial" />
					<p:tooltip for="residencial" showEvent="focus" hideEvent="blur" />

					<h:outputText value="Comercial :" />
					<p:inputMask id="comercial"
						value="#{eleitorController.eleitor.comercial}" maxlength="10"
						mask="(99) 9999-9999" title="informe o numero do fone comercial" />
					<p:tooltip for="comercial" showEvent="focus" hideEvent="blur" />

					<h:outputText value="Editable: " />
					<p:selectOneMenu value="#{eleitorController.responsavel.id}"
						style="width:250px;">
						<f:selectItem itemLabel="Selecione o responsavel" itemValue="" />
						<f:selectItems value="#{eleitorController.responsaveis}"
							var="item" itemLabel="#{item.nome}" itemValue="#{item.id}" />
					</p:selectOneMenu>

					<!-- -->
				</h:panelGrid>
				<p:toolbar align="center">
					<p:toolbarGroup align="center">
						<p:commandButton value="Salvar"
							action="#{eleitorController.salvar()}" update="painelLista" />
						<p:commandButton value="Novo" type="reset" />

						<h:commandButton value="Imprimir"
							action="#{eleitorController.imprimir()}">
						</h:commandButton>

					</p:toolbarGroup>
				</p:toolbar>

				<h:panelGrid id="painelLista" columns="1">
					<p:dataTable var="listEleitores" id="tableLista"
						value="#{eleitorController.eleitores}" paginator="true" rows="5"
						style="width:800px;">
						<p:column>
							<f:facet name="header">
								<h:outputText value="Nome" width="40%" />
							</f:facet>
							<h:outputText value="#{listEleitores.nome}" />
						</p:column>

						<p:column>
							<f:facet name="header" width="30%">
								<h:outputText value="Rua" />
							</f:facet>
							<h:outputText value="#{listEleitores.rua}" />
						</p:column>

						<p:column>
							<f:facet name="header" width="30%">
								<h:outputText value="Titulo" />
							</f:facet>
							<h:outputText value="#{listEleitores.titulo}" />
						</p:column>

						<p:column width="15%">
							<p:commandButton title="Editar" update="painel"
								action="#{eleitorController.editar}" ajax="false"
								image="ui-icon ui-icon-wrench">
								<f:setPropertyActionListener
									target="#{eleitorController.selected}" value="#{listEleitores}" />
							</p:commandButton>
						</p:column>

						<p:column>
							<p:commandButton title="Deletar" update="tableLista" ajax="false"
								action="#{eleitorController.deletar}"
								image="ui-icon ui-icon-trash">
								<f:setPropertyActionListener
									target="#{eleitorController.selected}" value="#{listEleitores}" />
							</p:commandButton>
						</p:column>

					</p:dataTable>
				</h:panelGrid>
			</div>
		</h:form>
	</ui:define>
</ui:composition>